<p-growl [styleClass]="'center-message'" baseZIndex="10003" [immutable]="false"></p-growl>
<p-confirmDialog></p-confirmDialog>
<div class="saas-container"  [ngClass]="{'bg-f5f8fa':!hasHeader,'height-full':hasHeader}">
    <div class="nosidebar-nav" *ngIf="!hasHeader">
        <div class="inline-block" >
                <span class="inline-block logo-img p-0" style="height:25px;">
                        <img src="/assets/imgs/logo.png" class="height-full">
                  </span>
                  <span class="logo-text inline-block font-14 opacity06" style="line-height:initial">
                        <span>综合管理系统</span> 
                                 
                  </span>
        </div>
    </div>
    <div class="navtop" [ngStyle]="{'height':navHeight}" *ngIf="hasHeader">


        <div class="inline-block  nav " #nav>
                <div class="logo clearfix inline-block " [ngClass]="{'text-center':small}" [ngStyle]="{'width':'100%','height':navHeight,'line-height':navHeight}">

                    <!--<span class="pull-left inline-block logo-img" style="height:25px;">
                        <img src="/assets/imgs/logo.png" class="height-full">
                    </span>
                    <span class="logo-text inline-block color-fff font-14 m-t-20" style="line-height:initial">
                        <span>速美超级家家装综合管理系统</span>
                    </span>-->
                </div>
        </div>

        <div class="pull-right clearfix ccc font-size-14 m-r-20">
            <div class="pull-left h-pointer" (click)="op.toggle($event)">
                <img src="{{iconUrl}}"  onError="this.src='/assets/imgs/defaultIcon.png'" class="user-img v-middle ">
                <span class="ui-clickable fa fa-fw fa-angle-down"></span>
            </div>
            <p-overlayPanel #op [style]="{'right':'0','top':'50px'}">
                <div class="logoutBtn clearfix">
                    <div class="content">
                        <div class="img-detial clearfix">
                            <img class="pull-left radius-2 p-t-5 imgIcon" src="{{iconUrl}}" onError="this.src='/assets/imgs/defaultIcon.png'">
                            <div class="pull-left p-t-5">
                                <span class="userType"><i class="userTypeText"></i> <i>{{name}}</i></span>
                                <span class="phone">{{mobile}}</span>
                            </div>
                        </div>
                        <div class="btns btn-cog" (click)="setting()"><i class="fa fa-cog" aria-hidden="true"></i>账号设置</div>
                        <div class="btns" (click)="logout()"><i class="fa fa-power-off" aria-hidden="true"></i>退出登录</div>
                    </div>

                </div>
            </p-overlayPanel>
        </div>
        <div class="saas-bell">
            <span class="fa fa-bell relative" [routerLink]="['orders/message/message/list']">
                <span class="saas-bell-ripple" ></span>
            </span>
        </div>
    </div>

    <div class="sidebar bg-1d2531"  [ngClass]="{'sidebarHover':small}" [ngStyle]="{'top': navHeight,'width':sidebarWidth,height:('calc(100% - ' + navHeight + ')')}" *ngIf="hasSidebar" @flyOut>
        <div style="padding-top:10px">
                <span class="color-eee font-18 m-0-21 pull-left h-pointer" (click)="toggle()">
                        <i class="fa" [ngClass]="{'fa-indent':small,'fa-outdent':!small}"></i>
            </span>

        </div>
        <div class="sidebarMenu">
             <p-panelMenu  activeClass="bg-1a91eb" activeSubClass="color-ff9f00" subClass="bg-474f5d border-none" expandedClass="pull-right" [multiple]="false" styleClass='menu-item' [model]="items" [style]="{'width':'100%','color':'#fff','margin-bottom':'70px'}"></p-panelMenu>
        </div>
    </div>
    <div class="container font-14" [style.display]="!hasSidebar?'flow-root':'block'" [class.all-page]="!hasSidebar" [ngStyle]="{'padding-top': navHeight,'margin-left':sidebarWidth,'height':('calc(100% - ' + navHeight + ')')}">
        <router-outlet></router-outlet>
    </div>

    <div id="new-clue">
        <p-msgdialog *ngFor="let item of messages;index as i" [zIndex]="i+100" [value]="item" [time]="item?.timeNum" (onLeftBtnClick)="onLeftBtnClick($event)" (onRightBtnClick)="onRightBtnClick($event)" (onClose)="onClose($event,i)"> </p-msgdialog>
        <p-dialogmsg *ngFor="let item of msgs;i as index" [onlyContent]="item.onlyContent" [content]="item.content" [title]="item?.title" [time]="item?.timeNum" [value]="item" [showClose]="item?.showClose" [zIndex]="i+100" [rejectLabel]="item.rejectLabel" [clueCode]="item?.data?.clueCode" [clueName]="item?.data?.clueName" (onAccept)="accept($event)" (onReject)="reject($event)"></p-dialogmsg>
    </div>
